﻿@{
    ViewBag.Title = "Form";
    Layout = "~/Views/Shared/_FlowForm.cshtml";
}@using LeSoft.Application.Code;
<script src="~/Content/scripts/jquery/layer/jquery.js?v=1.83.min"></script>
<script src="~/Content/scripts/jquery/layer/layer.min.js"></script>
<link href="~/Content/styles/font-awesome.min.css" rel="stylesheet" />
<link href="~/Content/styles/BillDetail.css?v=1.1" rel="stylesheet" />
<link href="~/Content/styles/anitmate.css" rel="stylesheet" />
<link href="~/Content/styles/style.css" rel="stylesheet" />
<link href="~/Content/scripts/plugins/tree/tree.css" rel="stylesheet" />
<link href="~/Content/scripts/plugins/jqgrid/jqgrid.css" rel="stylesheet" />
<script src="~/Content/scripts/plugins/tree/tree.js"></script>
<script src="/Content/scripts/plugins/validator/js?v=XgpF3bkqcHESsLip2j1dhS6n2I-zHyD2VCazpanqH6Q1"></script>
<script src="/Content/scripts/utils/js?v=FNqaC7G7A87_J4VCIQpQEAO-d_2Qf2wSxoZexwRzulo1"></script>
<script src="~/Content/scripts/plugins/jqgrid/jqgrid.js"></script>
<script src="~/Content/scripts/jquery/ajaxfileupload.js"></script>
<script src="~/Content/scripts/utils/LeSoft-ui.js"></script>
<script>
    var keyValue = request('keyValue');
    var billDetailId = "";
    var organizeid = "";
    var sourceType = 1, sourceId = "", fileFilter = [];
    var DeviceId = "";
    var State = "";
    var OperateMemo;
    $(function () {
        initControl();
        //上传图片
        $('#fileImage').change(function () {
            var arrFile = [];
            var files = document.getElementById('fileImage').files;

            if (files.length > 0) {
                if (fileFilter.length > 0) {
                    for (var j = 0, fileb; fileb = fileFilter[j]; j++) {
                        arrFile.push(fileb);
                    }
                    for (var i = 0, filea; filea = files[i]; i++) {
                        var count = 0;
                        for (var j = 0, fileb; fileb = fileFilter[j]; j++) {
                            if (filea.name == fileb.name && filea.size == fileb.size) {
                                count++;
                            }
                        }
                        if (count == 0) {
                            arrFile.push(filea);
                        }
                    }
                    SetFile(arrFile);
                }
                else {
                    SetFile(files);
                }
            }


        });
        //计算居中位置
        var mg_top = ((parseInt($(window).height()) - parseInt($(".photo-div").height())) / 2);

        $(".photo-div").css({
            "margin-top": "" + mg_top + "px"
        });
        //关闭
        $(".photo-close").click(function () {
            $(".photo-mask").hide();
            $(".photo-panel").hide();
        });
        //下一张
        $(".photo-panel .photo-div .arrow-next").click(function () {
            img_index++;
            if (img_index >= $("#preview li img").length) {
                img_index = 0;
            }
            img_src = $("#preview li img").eq(img_index).attr("src");
            photoView($("#preview li img"));
        });
        //上一张
        $(".photo-panel .photo-div .arrow-prv").click(function () {
            img_index--;
            if (img_index < 0) {
                img_index = $("#preview li img").length - 1;
            }
            img_src = $("#preview li img").eq(img_index).attr("src");
            photoView($("#preview li img"));
        });
        //调用
        $("#preview li img").live("click", function () {

            $(".photo-mask").show();
            $(".photo-panel").show();
            img_src = $(this).attr("src");
            img_index = $(this).index();
            photoView($(this));
        });
    });

    function initControl() {

        $("#OrganizeId").ComboBoxTree({
            url: "../../BaseManage/Organize/GetTreeJson",
            description: "==请选择所属机构==",
            height: "250px",
            click: function (data) {
                organizeid = data.id;
            }
        });

        //投诉方式
        $("#ComplaintWay").ComboBoxTree({
            url: "../../SystemManage/DataItemDetail/GetDataItemTreeJson",
            param: { EnCode: "ComplaintWay" },
            description: "==请选择==",
            height: "200px"
        });

        $("#CheckState").ComboBox({
            data: [{ "key": "1", "value": "未检验" }, { "key": "2", "value": "已检验" }],
            id: "key",
            text: "value",
            description: "==请选择==",
            height: "100px"
        });
        $("#State").ComboBox({
            data: [{ "key": "1", "value": "待处理" }, { "key": "2", "value": "派单中" }, { "key": "3", "value": "进行中" }, { "key": "4", "value": "已完成" }, { "key": "6", "value": "未检验" }, { "key": "7", "value": "已检验" }, { "key": "5", "value": "不维修" }],
            id: "key",
            text: "value",
            description: "            ",
            height: "150px"
        });
        $("#State").ComboBoxSetValue(1);

        GetGrid1();
        //获取表单
        if (!!keyValue) {

            $.SetForm({
                url: "../../PropertyManage/CS_DeviceRepair/GetFormJson",
                param: { keyValue: keyValue },
                success: function (data) {
                    $("#Repairform1").SetWebControls(data.data1);
                    $("#Repairform").SetWebControls(data.data1);
                    SetFileDisplay(data.data2);
                    sourceType = data.data1.SourceType;
                    sourceId = data.data1.SourceId;
                    organizeid = data.data1.OrganizeId;
                    DeviceId = data.data1.DeviceId;
                    //$("#DeviceName").val(data.data3.Name);
                    State = data.data1.State;
                    if (data.data1.State != 1) {
                        $(".BaseClass").attr("disabled", "disabled");
                    }
                    $("#State").ComboBoxSetValue(parseInt(State));
                    $("#gridTable1")[0].addJSONData(data.data3);
                    var ids;
                    $.each(data.data3, function (index, item) {
                        ids += item["DeviceId"];
                    });
                    $("#DeviceId").val(ids);
                    OperateMemo = data.data1.OperateMemo;
                    var json = eval('[' + data.data1.OperateMemo + ']');
                    GetGrid(json);
                }

            });
        }


    }
    function GetMan(s) {
        if (organizeid == "") {
            dialogMsg("请先选择机构", 0);
            return;
        }
        if (State != 1 && State != "") {
            return;
        }
        else {
            var options = {};
            switch (s) {
                case 1: {
                    var data = [{ id: "BXRMan", text: "", value: "" }, { id: "BXLinkPhone", text: "", value: "" }];
                    options = {
                        type: 3,
                        organizeid: $("#OrganizeId").attr('data-value'),
                        data: data
                    };
                }; break;
                case 2: {
                    options = {
                        type: 10,
                        organizeid: $("#OrganizeId").attr('data-value'),
                        data: [],
                        Name: "DeviceRepair"
                    };
                }; break;
                case 3: {
                    var data = [{ id: "SendManId", text: "", value: "" }];
                    options = {
                        type: 3,
                        organizeid: $("#OrganizeId").attr('data-value'),
                        data: data
                    };
                }; break;
            }
            DataItemClick(JSON.stringify(options));
        }
    }


    function GetGrid(data) {
        debugger;
        var $gridTable = $("#gridTable");
        $gridTable.jqGrid({
            datatype: "json",
            height: $(window).height() - 48,
            autowidth: true,
            colModel: [
                        { label: '项目主键', name: 'Id', hidden: true },
                        { label: '业务类别', name: 'Type', width: 100, align: 'center', sortable: false },
                        { label: '操作人', name: 'FromOperateName', width: 100, align: 'center', sortable: false },
                        { label: '操作时间', name: 'Date', width: 170, align: 'center', sortable: false },
                        {
                            label: "操作内容", name: "Content", index: "Content", width: 590, align: "left", sortable: false,
                            formatter: function (cellvalue, options, rowObject) {
                                if (!!rowObject.ToOperateName)
                                    return "发起者：" + rowObject.FromOperateName + "，接受者：" + rowObject.ToOperateName + "<br/>" + cellvalue;
                                else
                                    return "发起者：" + rowObject.FromOperateName + "<br/>" + cellvalue;
                            }
                        },
            ],
            viewrecords: true,
            rownumbers: false,
            shrinkToFit: false,
            gridview: true
        });
        $gridTable[0].addJSONData(data);
    }

    function GetSum() {
        if ($("#Labor").val() != "" && $("#Material").val() != "" & $("#Other").val() != "") {
            $("#Count").val(parseFloat($("#Labor").val()) + parseFloat($("#Other").val()) + parseFloat($("#Material").val()));
        }
        else {
            if ($("#Material").val() == "" && $("#Other").val() == "") {
                $("#Count").val(parseFloat($("#Labor").val()));
            }
            if ($("#Labor").val() == "" && $("#Other").val() == "") {
                $("#Count").val(parseFloat($("#Material").val()));
            }
            if ($("#Labor").val() == "" && $("#Material").val() == "") {
                $("#Count").val(parseFloat($("#Other").val()));
            }
            if ($("#Labor").val() == "") {
                $("#Count").val(parseFloat($("#Other").val()) + parseFloat($("#Material").val()));
            }
            if ($("#Material").val() == "") {
                $("#Count").val(parseFloat($("#Other").val()) + parseFloat($("#Labor").val()));
            }
            if ($("#Other").val() == "") {
                $("#Count").val(parseFloat($("#Labor").val()) + parseFloat($("#Material").val()));
            }
        }

    }


    function btn_Check() {

        keyValue = $("#gridTable").jqGridRowValue("Id");
        if (keyValue) {
            dialogMsg("查看详情！", 0);
        } else {
            dialogMsg('请选择需要查看的数据项！', 0);
        }
    }
    //自适应预览
    function photoView(obj) {
        if ($(obj).width() >= $(obj).height()) {
            $(".photo-panel .photo-div .photo-img .photo-view-h").attr("class", "photo-view-w");
            $(".photo-panel .photo-div .photo-img .photo-view-w img").attr("src", img_src);
        } else {
            $(".photo-panel .photo-div .photo-img .photo-view-w").attr("class", "photo-view-h");
            $(".photo-panel .photo-div .photo-img .photo-view-h img").attr("src", img_src);
        }


    }
    function SetFile(files) {
        if (files.length > 4) {
            dialogMsg("最多只能传4个附件", 0);
            return;
        }

        fileFilter = files;
        var _html = "<ul>";
        for (var i = 0; i < files.length; i++) {
            if (files[i]) {
                if (files[i].constructor.name == "File") {
                    _html += "<li><a  title='删除' >x</a><img id='uploadImage_" + i + "' src='" + window.URL.createObjectURL(files[i]) + "'  /></li>";
                }
                else if (files[i].constructor.name == "Object") {
                    _html += "<li><a  title='删除'>x</a><img id='uploadImage_" + i + "' src='" + files[i].FileUrl + "'  /></li>";
                }
            }
        }
        _html += "</ul>";
        $("#preview").html(_html);

    }
    //上传文件到后台
    function UploadFile() {

        $.ajaxFileUpload({
            url: "../../ResourceManage/RS_Device/UploadFile",
            secureuri: false,
            fileElementId: 'fileImage',
            dataType: 'json'
        });
    }
    function SetFileDisplay(dataArray) {
        var _html = "<ul>";

        if (dataArray.length > 0) {
            fileFilter = dataArray;
            for (var i = 0; i < dataArray.length; i++) {
                if (dataArray[i].Type == 10 || dataArray[i].Type == 41) {
                    _html += "<li><img id='uploadImage_" + i + "' src='" + dataArray[i].FileUrl + "'  /></li>";
                }
            }
            _html += "</ul>";
            $("#preview").html(_html);
        }
    }

    //维修单明细
    function GetGrid1() {
        var $gridTable = $("#gridTable1");
        var selectedRowIndex = 0;
        $gridTable.jqGrid({
            datatype: "json",
            height: 250,
            autowidth: true,
            unwritten: false,
            colModel: [
                { label: '主键', name: 'Id', hidden: true },
                { label: '设备主键', name: 'DeviceId', hidden: true },
                { label: '维修人Id', name: 'WXRId', hidden: true },
                { label: '设备名称', name: 'DeviceName', width: 89, align: "left", sortable: false },
                { label: '设备编号', name: 'DeviceCode', width: 89, align: "left", sortable: false },
                { label: '设备所属区域', name: 'PStructName', width: 89, align: "left", sortable: false },
                { label: '问题描述', name: 'Issuse', width: 89, align: "left", sortable: false, editable: true, edittype: "text" },
                {
                    label: '维修状态', name: 'State', width: 89, align: "left", sortable: false, editable: true, edittype: "select", editoptions: { value: { 1: '待处理', 3: '进行中', 4: '已完成' } },
                    formatter: function (cellvalue, options, rowObject) {
                        cellvalue = TextSwitchValue(cellvalue);
                        var Msg = "";
                        switch (cellvalue) {
                            case 1: Msg = "<span  class='label label-danger'>待处理</span>";
                                break;
                            case 3: Msg = "<span  class='label label-info'>进行中</span>";
                                break;
                            case 4: Msg = "<span  class='label label-success'>已完成</span>";
                                break;
                                //case 3: Msg = "<span  class='label label-warning'>不处理</span>";
                                //    break;
                            default: Msg = !!cellvalue ? cellvalue : "<span  class='label label-danger'>待处理</span>";
                                break;
                        }
                        return Msg;
                    }
                },
                { label: '维修人', name: 'WXRName', width: 89, align: "left", sortable: false, editable: true, edittype: "text" },
                {
                    label: '维修开始时间', name: 'WXBeginTime', width: 90, align: "left", sortable: false, editable: true, edittype: "text", editoptions: {
                        dataInit: function (el) {
                            $(el).addClass("input-wdatepicker");
                            if (!$(el).val())
                                $(el).val("@DateTime.Now.ToString("yyyy-MM-dd")");
                        }
                    }
                },
                {
                    label: "维修结束时间", name: "WXEndTime", width: 90, align: "left", sortable: false, editable: true, edittype: "text", editoptions: {
                        dataInit: function (el) {
                            $(el).addClass("input-wdatepicker").css("background", "");
                            if (!$(el).val())
                                $(el).val("@DateTime.Now.AddDays(1).ToString("yyyy-MM-dd")");
                            var WXBeginTime = $(el).parent().prev().children();
                            $(el).focus(function () {
                                WdatePicker({ minDate: '#F{$dp.$D(\'' + WXBeginTime.attr("Id") + '\')}' });
                            });
                            WXBeginTime.focus(function () {
                                WdatePicker({ maxDate: '#F{$dp.$D(\'' + $(el).attr("Id") + '\')}' });
                            });
                            $(".input-wdatepicker").css("background", "#FFF");
                        }
                    }
                },
                { label: "维修时长", name: "WXDate", width: 90, align: "left", sortable: false, editable: true, edittype: "text" },
                { label: "维修情况说明", name: "WXContent", width: 90, align: "left", sortable: false, editable: true, edittype: "text" },
                { label: "验收人", name: "CheckMan", width: 90, align: "left", sortable: false, hidden: true },
                { label: "验收时间", name: "CheckDate", width: 90, align: "left", sortable: false, hidden: true },
                {
                    label: "验收状态", name: "CheckState", width: 90, align: "left", sortable: false, hidden: true,
                    formatter: function (cellvalue, options, rowObject) {
                        var Msg = "";
                        switch (cellvalue) {
                            case 1: Msg = "<span  class='label label-warning'>未检验</span>";
                                break;
                            case 2: Msg = "<span  class='label label-success'>已检验</span>";
                                break;
                            default: Msg = "---";
                                break;
                        }
                        return Msg;
                    }
                },
                { label: "验收说明", name: "CheckMemo", width: 90, align: "left", sortable: false, hidden: true }
            ],
            caption: "维修单明细",
            rowNum: "1000",
            rownumbers: true,
            shrinkToFit: false,
            gridview: true,
            editurl: "SaveRow",
            hidegrid: false,
            ondblClickRow: function (rowid) {
                EditSelectRow(rowid);
            }
        });
        //选中行启用行编辑
        function EditSelectRow(id) {
            if (selectedRowIndex != null && selectedRowIndex != "" && selectedRowIndex > 0) {
                $gridTable.jqGrid('saveRow', selectedRowIndex);//保存上一行
            }
            //当前选中行
            selectedRowIndex = id;//临时存储当前选中行
            $gridTable.jqGrid('editRow', id, true);
        }
    }

    function TextSwitchValue(text) {
        if (!!text && (typeof (text) == 'string') && text.constructor == String) {
            var value;
            switch (text) {
                case "待处理": value = 1; break;
                case "进行中": value = 3; break;
                case "已完成": value = 4; break;
                default: value = 1; break;
            }
            return value;
        }
        else {
            return text;
        }
    }

    //删除
    function btn_deleteDetail() {
        var keyValue = $("#gridTable1").getGridParam('selrow');
        if (keyValue) {
            dialogConfirm('注：您确定要移除吗？该操作将无法恢复？', function (r) {
                if (r) {
                    var ids = $("#DeviceId").val();
                    var id = $("#gridTable1").getRowData(keyValue).DeviceId;
                    $("#DeviceId").val(ids.replace(id + ",", ""));
                    $("#gridTable1").delRowData(keyValue);
                    dialogMsg("移除成功。", 1);
                }
            });

        } else {
            dialogMsg('请选择需要移除的数据！', 0);
        }
    }


    //保存表单
    function AcceptClick() {
        if (!$('#Repairform').Validform()) {
            return false;
        }
        $("#gridTable1").jqGrid('saveRow', $('#gridTable1').jqGrid('getGridParam', 'selrow'));
        var listDetail = $("#gridTable1").jqGrid("getRowData");
        if (!listDetail || listDetail.length < 0) {
            dialogMsg('请选择至少一个设备！', 0);
            return false;
        }
        $.each(listDetail, function (index, item) {
            item["CheckState"] = 1;
            item["State"] = item["State"].indexOf("待处理") > 0 ? 1 : item["State"].indexOf("进行中") > 0 ? 3 : 4;
        });
        var postData = $("#Repairform").GetWebControls(keyValue);
        postData["ArriveDate"] = $("#ArriveDate").val();
        postData["BeginDate"] = $("#BeginDate").val();
        postData["EndDate"] = $("#EndDate").val();
        postData["RepairedContent"] = $("#RepairedContent").val();
        postData["Labor"] = $("#Labor").val();
        postData["Material"] = $("#Material").val();
        postData["Other"] = $("#Other").val();
        postData["Count"] = $("#Count").val();
        postData["CheckMan"] = $("#CheckMan").val();
        postData["CheckManId"] = $("#CheckMan").attr('title');
        postData["BXRName"] = $("#BXRMan").val();
        postData["BXRId"] = $("#BXRMan").attr('title');
        postData["CheckDate"] = $("#CheckDate").val();
        postData["CheckState"] = $("#CheckState").val();
        postData["CheckMemo"] = $("#CheckMemo").val();
        postData["EnabledMark"] = 1;
        postData["OperateMemo"] = OperateMemo;
        //UploadFile();
        var listFile = [];
        $.SaveForm({
            url: "../../PropertyManage/CS_DeviceRepair/SaveForm?keyValue=" + keyValue,
            param: { entity: JSON.stringify(postData), listDetail: JSON.stringify(listDetail), listFile: JSON.stringify(listFile) },
            loading: "正在保存数据...",
            success: function () {
                // top.frames["ProductForm"].AcceptClick();
                $.currentIframe().$("#gridTable").resetSelection();
                $.currentIframe().$("#gridTable").trigger("reloadGrid");
            }
        })
    }

</script>
<div id="wrapper" style="background:#fff;">
    <div id="left-side" style="margin-top:5px;">
        <ul>
            <li class="choose active">
                制单派单
            </li>
            <li class="pay">
                维修检查
            </li>
            <li class="wrap">
                业务日志
            </li>
        </ul>
    </div>
    <div id="border">
        <div id="line" class="one"></div>
    </div>
    <div id="right-side" class="tab-content" style="width:100%;">
        <div id="first" class="tab-pane active">
            <div class="tab-content">
                <table class="form" id="Repairform">
                    <tr>
                        <td class="formTitle">所属机构<font face="宋体">*</font></td>
                        <td class="formValue" colspan="2">
                            <div id="OrganizeId" type="selectTree" class="ui-select BaseClass" isvalid="yes" checkexpession="NotNull"></div>
                        </td>
                        <th class="formTitle">单据编号</th>
                        <td class="formValue" colspan="2">
                            <input id="Code" type="text" readonly placeholder="系统自动编号" class="form-control BaseClass" />
                        </td>
                        <th class="formTitle">单据日期<font face="宋体">*</font></th>
                        <td class="formValue" colspan="2">
                            <input id="Date" type="text" class="form-control input-wdatepicker BaseClass" placeholder="请输入单据日期" value="@LeSoft.Util.Time.GetToday("yyyy-MM-dd HH:mm:ss")" onfocus="WdatePicker({ dateFmt: 'yyyy-MM-dd HH:mm:ss' })" />
                        </td>
                    </tr>
                    @*<tr>
                            <td class="formTitle">设备<font face="宋体">*</font></td>
                            <td class="formValue" colspan="8">
                                <div class="input-group" style="width: 100%;">
                                    <input id="DeviceId" class="form-control" type="hidden" />
                                    <input id="DeviceName" type="text" class="form-control BaseClass" />
                                    <span class="input-group-btn">
                                        <a onclick="GetMan(1)" class="form-control BaseClass" style="cursor: pointer"><i class="fa fa fa-book" style=" font-size: 20px; padding-right: 5px;  color: gray"></i></a>
                                    </span>
                                </div>
                            </td>
                        </tr>*@
                    <tr>
                        <td class="formTitle">报修人<font face="宋体">*</font></td>
                        <td class="formValue" colspan="2">
                            <div class="input-group" style="width: 100%;">
                                <input id="BXRMan" type="text" class="form-control   BaseClass">
                                <span class="input-group-btn">
                                    <a onclick="GetMan(1)" class="form-control  BaseClass" style="cursor: pointer"><i class="fa fa fa-book BaseClass  " style=" font-size: 20px; padding-right: 5px;   color: gray"></i></a>
                                </span>
                            </div>
                        </td>
                        <td class="formTitle">报修人联系电话<font face="宋体">*</font></td>
                        <td class="formValue" colspan="2"><input id="BXLinkPhone" type="text" class="form-control BaseClass" isvalid="yes" checkexpession="NotNull" /></td>
                        <td class="formTitle">报修方式<font face="宋体">*</font></td>
                        <td class="formValue" colspan="2"><input id="BXWay" type="text" class="form-control BaseClass" isvalid="yes" checkexpession="NotNull" /></td>
                    </tr>
                    <tr>
                        <td class="formTitle">报修内容<font face="宋体">*</font></td>
                        <td class="formValue" colspan="8"><input id="BXContent" type="text" class="form-control BaseClass" isvalid="yes" checkexpession="NotNull" /></td>
                    </tr>
                    <tr style="display:none;">
                        <th class="formTitle" valign="top" style="padding-top: 4px;">
                            备注
                        </th>
                        <td class="formValue" colspan="8">
                            <textarea id="Description" class="form-control BaseClass" style="height: 50px;"></textarea>
                        </td>
                    </tr>
                    <tr class="editRepair" style="display:none;">
                        <td class="formTitle">单据状态</td>
                        <td class="formValue" colspan="2">
                            <div id="State" type="selectTree" style="background:#eae7e7;" readonly class="ui-select "></div>
                        </td>
                        <td class="formTitle">制单人</td>
                        <td class="formValue" colspan="2">
                            <div id="State" type="selectTree" style="background:#eae7e7;" readonly class="ui-select "></div>
                        </td>
                        <td class="formTitle">制单时间</td>
                        <td class="formValue" colspan="2">
                            <div id="State" type="selectTree" style="background:#eae7e7;" readonly class="ui-select "></div>
                        </td>
                    </tr>
                    <tr style="height:32px;"><td colspan="9"><hr style="background-color: #cecece; height: 1px;" /></td> </tr>
                    <tr>
                        <td colspan="9">
                            <div class="toolbar" style="height:41px;padding:5px;">
                                <div class="btn-group" style="float:right;">
                                    <label id="lr-addDetail" class="btn btn-default" onclick="GetMan(2)"><i class="fa fa-plus"></i>&nbsp;新增</label>
                                    <label id="lr-deleteDetail" class="btn btn-default" onclick="btn_deleteDetail()"><i class="fa fa-trash-o"></i>&nbsp;删除</label>
                                </div>
                                <script>$('.toolbar').authorizeButton()</script>
                            </div>
                            <table id="gridTable1"></table>
                            <input id="DeviceId" class="form-control" type="hidden" />
                        </td>
                    </tr>
                    <tr style=" height: 10px; border-bottom: 1px dashed #cecece; display: none;"><td colspan="9"></td> </tr>
                    <tr style="display:none;">
                        <td colspan="6" class="BaseClass">
                            <div class="box" style="height: 100px;">
                                <img style="position: relative; float: left; width: 60px; height: 60px;" src="~/Content/images/icon_app_add.png" />
                                <input id="fileImage" type="file" size="30" class="BaseClass" name="fileselect[]" multiple="multiple" style="position: absolute; width: 60px; height: 60px; opacity: 0;" />
                                <div id="preview" class="upload_preview"></div>
                                <div class="photo-mask"></div>
                                <div class="photo-panel">
                                    <div class="photo-div">
                                        <div class="photo-left">
                                            <div class="arrow-prv "></div>
                                        </div>
                                        <div class="photo-img">
                                            <div class="photo-bar">
                                                <div class="photo-close">X</div>
                                            </div>
                                            <div class="photo-view-h">
                                                <img src="" />
                                            </div>
                                        </div>
                                        <div class="photo-right">
                                            <div class="arrow-next"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
        <div id="second" class="tab-pane">
            <div id="CompleteInfo">
                <table class="form" id="Repairform1" style="width:95%;">
                    <tr>
                        <td class="formTitle">维修到达时间</td>
                        <td class="formValue" colspan="2"><input id="ArriveDate" type="text" class="form-control input-wdatepicker " placeholder="请输入选择时间" onfocus="WdatePicker({ dateFmt: 'yyyy-MM-dd HH:mm:ss' })" /></td>
                        <td class="formTitle">维修开始时间</td>
                        <td class="formValue" colspan="2"><input id="BeginDate" type="text" class="form-control input-wdatepicker " placeholder="请输入选择时间" onfocus="WdatePicker({ dateFmt: 'yyyy-MM-dd HH:mm:ss' })" /></td>
                        <td class="formTitle">维修结束时间</td>
                        <td class="formValue" colspan="2"><input id="EndDate" type="text" class="form-control input-wdatepicker " placeholder="请输入选择时间" onfocus="WdatePicker({ dateFmt: 'yyyy-MM-dd HH:mm:ss' })" /></td>
                    </tr>
                    <tr>
                        <td class="formTitle">维修情况说明</td>
                        <td class="formValue" colspan="8">
                            <textarea id="RepairedContent" class="form-control" style="height: 50px;"></textarea>
                        </td>
                    </tr>
                    <tr>
                        <td class="formTitle">
                            维修费用
                        </td>
                        <td colspan="2">
                            <div class="input-group" style="width: 100%;">
                                <span class="input-group-btn">
                                    <a class="form-control " style="cursor: pointer">人工费</a>
                                </span>
                                <input id="Labor" type="number" onkeyup="GetSum()" name="deviceMoney" class="form-control  ">
                            </div>
                        </td>
                        <td colspan="2">
                            <div class="input-group" style="width: 100%;">
                                <span class="input-group-btn">
                                    <a class="form-control" style="cursor: pointer">+材料费</a>
                                </span>
                                <input id="Material" type="number" onkeyup="GetSum()" name="deviceMoney" class="form-control ">
                            </div>
                        </td>
                        <td colspan="2">
                            <div class="input-group" style="width: 100%;">
                                <span class="input-group-btn">
                                    <a class="form-control  " style="cursor: pointer">+其他费</a>
                                </span>
                                <input id="Other" type="number" onkeyup="GetSum()" name="deviceMoney" class="form-control ">
                            </div>
                        </td>
                        <td colspan="2">
                            <div class="input-group" style="width: 100%;">
                                <span class="input-group-btn">
                                    <a class="form-control  " style="cursor: pointer">=</a>
                                </span>
                                <input id="Count" type="number" onkeyup="GetSum()" onfocus=" " class="form-control ">
                            </div>
                        </td>
                    </tr>
                    <tr style=" height: 20px; border-bottom: 1px dashed #cecece;"><td colspan="9"></td> </tr>
                    <tr>
                        <td colspan="6">
                            <div class="box" style="height: 100px;">
                                <img style="position: relative; float: left; width: 60px; height: 60px;" src="~/Content/images/icon_app_add.png" />
                                <input id="fileImage1" type="file" size="30" class="BaseClass" name="fileselect1[]" multiple style="position: absolute; width: 60px; height: 60px; opacity: 0;" />
                                <div id="preview1" class="upload_preview">

                                </div>
                                <div class="photo-mask"></div>
                                <div class="photo-panel">
                                    <div class="photo-div">
                                        <div class="photo-left">
                                            <div class="arrow-prv"></div>
                                        </div>
                                        <div class="photo-img">
                                            <div class="photo-bar">
                                                <div class="photo-close"></div>
                                            </div>
                                            <div class="photo-view-h">
                                                <img src="" />
                                            </div>
                                        </div>
                                        <div class="photo-right">
                                            <div class="arrow-next"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </td>
                    </tr>
                    <tr style=" height: 10px; border-bottom: 1px dashed #cecece;"><td colspan="9"></td> </tr>
                    <tr>
                        <td class="formTitle">验收人</td>
                        <td class="formValue" colspan="2">
                            <div class="input-group" style="width: 100%;">
                                <input id="CheckMan" type="text" class="form-control ">
                                <span class="input-group-btn">
                                    <a onclick="GetMan(3)" class="form-control " style="cursor: pointer"><i class="fa fa fa-book" style=" font-size: 20px; padding-right: 5px;   color: gray"></i></a>
                                </span>
                            </div>
                        </td>
                        <td class="formTitle">验收时间</td>
                        <td class="formValue" colspan="2">
                            <input id="CheckDate" type="text" class="form-control input-wdatepicker " placeholder="请输入选择时间" onfocus="WdatePicker({ dateFmt: 'yyyy-MM-dd HH:mm:ss' })" />
                        </td>
                        <td class="formTitle">验收状态</td>

                        <td class="formValue" colspan="2">
                            <div id="CheckState" type="selectTree" class="ui-select " isvalid="yes" checkexpession="NotNull"></div>
                        </td>

                    </tr>
                    <tr>
                        <th class="formTitle">验收情况</th>
                        <td class="formValue" colspan="8">
                            <textarea id="CheckMemo" class="form-control" style="height: 100px;"></textarea>
                        </td>
                    </tr>

                </table>
            </div>
        </div>
        <div id="third" class="tab-pane" style="max-height: 762px;overflow-y: scroll;">
            <div class="gridPanel">
                <table id="gridTable"></table>
            </div>
        </div>
    </div>
    <script>
        $('.choose').click(function () {
            $('.choose').addClass('active');
            $('.pay').removeClass('active');
            $('.wrap').removeClass('active');
            $('.ship').removeClass('active');
            $('#line').addClass('one');
            $('#line').removeClass('two');
            $('#line').removeClass('three');
            $('#line').removeClass('four');
            $('#first').addClass('active');
            $('#second').removeClass('active');
            $('#third').removeClass('active');
            $('#fourth').removeClass('active');
            $("#right-side table").css("margin", "15px 0px");
        });
        $('.pay').click(function () {

            $('.pay').addClass('active');
            $('.choose').removeClass('active');
            $('.wrap').removeClass('active');
            $('.ship').removeClass('active');
            $('#line').addClass('two');
            $('#line').removeClass('one');
            $('#line').removeClass('three');
            $('#line').removeClass('four');
            $('#first').removeClass('active');
            $('#second').addClass('active');
            $('#third').removeClass('active');
            $('#fourth').removeClass('active');
            $("#right-side table").css("margin", "15px 0px");
        });
        $('.wrap').click(function () {
            $('.wrap').addClass('active');
            $('.pay').removeClass('active');
            $('.choose').removeClass('active');
            $('.ship').removeClass('active');
            $('#line').addClass('three');
            $('#line').removeClass('two');
            $('#line').removeClass('one');
            $('#line').removeClass('four');
            $('#first').removeClass('active');
            $('#second').removeClass('active');
            $('#third').addClass('active');
            $('#fourth').removeClass('active');
            $("#right-side table").css("margin", "0px");
        });



    </script>

</div>

